﻿<%@ Page Language="C#" MasterPageFile="~/MonstromPets.master" AutoEventWireup="true" CodeFile="MonstromPets_Products.aspx.cs" Inherits="CJChemicals_NewProducts" %>

<asp:Content ID="cphMenu" ContentPlaceHolderID="cphMenu" runat="server">
             <ul class="Topmenu">
                    <li><a href="MonstromPets_HomePage.aspx" title="Home Page" class="item2">Home Page</a></li>
                            <img src="images/Spacer.png" alt="Line" title="Line" class="menuLine"/>
                    <li><a href="MonstromPets_Products.aspx" class="active" title="New Products">Products</a></li>
                            <img src="images/Spacer.png" alt="Line" title="Line" class="menuLine"/>
                    <li><a href="MonstromPets_Specials.aspx" class="item2" title="Specials">Specials</a></li>
                            <img src="images/Spacer.png"  alt="Line" title="Line" class="menuLine"/>
                    <li><a href="MonstromPets_MyAccount.aspx" class="item2" title="My Account">My Account</a></li>
                            <img src="images/Spacer.png"  alt="Line" title="Line" class="menuLine"/>
                    <li><a href="MonstromPets_ContactUs.aspx" class="item2" title="Contact Us">Contact Us</a></li>
                </ul>
</asp:Content>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
 
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="cphContent" runat="server">
    <div class="container_2" style="height: 1000px;">
            <div class="grid_3">
                <center>
                    <div class="Wrapper-Products">
                        <div class="Title">
                            <p>PRODUCTS</p>
                        </div>
                        <div class="SearchContainer">
                            <div class="SearchBox">
                            <div class="TitleSearch">Search</div>
                                <span>Type of Product</span> 
                                <div class="Spacer2"></div>   
                                <asp:DropDownList ID="DropDownList1" CssClass="ComboBoxSearchBox" runat="server">
                                </asp:DropDownList>

                                <div class="Spacer"></div> 
                                <span>Price</span> 
                                <div class="Spacer2"></div>   
                                <asp:DropDownList ID="DropDownList2" CssClass="ComboBoxSearchBox2" runat="server">
                                    <asp:ListItem>Any Price</asp:ListItem>
                                </asp:DropDownList>
                                
                                <div class="SearchBoxspan">To</div>
                                
                                <asp:DropDownList ID="DropDownList3" CssClass="ComboBoxSearchBox2" runat="server">
                                    <asp:ListItem>Any Price</asp:ListItem>
                                </asp:DropDownList>
                                <div class="buttons">
                                    <a href="#">Search</a>
                                </div>
                            </div>
                        
                            <div class="spacer-3"></div>

                            <div class="SearchDetails">
                                <h4>Search Details</h4>
                                <p>Currently displaying <b>all Products</b> between <b>any</b> and <b>any</b> price</p>
                                <p>Displaying <b><b>1</b></b> to <b><b>9</b></b> (of <b><b>64</b></b> products)</p>
                            
                                <div class="Paging">
                                    <div class="PagingParagraph">Result Pages</div>
                                    <a href="#" class="pagingLink">1</a>
                                    <a href="#" class="pagingLink">2</a>
                                    <a href="#" class="pagingLink">3</a>
                                    <a href="#" class="pagingLink">4</a>
                                    <a href="#" class="pagingLink">5</a>
                                    <a href="#" class="pagingLink">6</a>
                                    <a href="#" class="pagingLink">7</a>
                                    <a href="#" class="pagingLink">8</a><br />

                                    <div class="NextButton">
                                        <a href="#" >Next Page</a>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="container_2" style="height: 676px;">
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div> 
                            
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div>
                            
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div>
                            
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div>
                            
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div>   
                            
                            <div class="grid_4" >
                                <center>
                                    <div class="Wrapper-Item">
                                        <div class="Title">
                                            <p><a href="#">Product #0057</a></p>
                                        </div>
                                        <div class="Image">
                                            <img alt="Product Image" src="images/productTest.png" style="width: 120px" />
                                        </div>
                                        <div class="Description">
                                            <p>
                                                Best if you want to: Cleanse your skin with a moisturizing, vegetable-based soap that has a bright citrus scent to refresh and uplift the senses.
                                            </p>
                                        </div>
                                        <div class="Details">
                                            <div class="Price">
                                                R 350.50
                                            </div>
                                            <div class="ImagesRight">
                                                 <a href="#" title="More Info"><img alt="Product Image" src="images/MoreInfo.png" class="images" /></a>
                                                 <a href="#" title="Add to Shopping-Cart"><img alt="Product Image" src="images/AddToCart.png" class="images" /></a>
                                            </div>
                                        </div>
                        
                                    </div>
                                </center>
                            </div>              
                        </div>  
                        <div class="PagingBottom">
                                    <a href="#" class="pagingLink">1</a>
                                    <a href="#" class="pagingLink">2</a>
                                    <a href="#" class="pagingLink">3</a>
                                    <a href="#" class="pagingLink">4</a>
                                    <a href="#" class="pagingLink">5</a>
                                    <a href="#" class="pagingLink">6</a>
                                    <a href="#" class="pagingLink">7</a>
                               
                                </div>
                    </div>
                </center>
            </div>
        </div>
</asp:Content>
